<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>运输信息</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <jsp:include page="${pageContext.request.contextPath }/resource_path.jsp" flush="true"/>
</head>
<body class="layui-anim layui-anim-up">
<div class="x-nav">
    <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a>
            <cite>运输信息</cite>
        </a>
    </span>
</div>
<div class="x-body">
    <div class="layui-row">
        <form class="layui-form layui-col-md12 x-so" onsubmit="return false">
            <input type="text" name="keyword" id="keyword"  placeholder="请输入车牌号名称" autocomplete="off" class="layui-input">
            <button class="layui-btn layui-btn-normal" data-type="reload"><i class="layui-icon layui-icon-search"></i>检索</button>
        </form>
    </div>
    <xblock>
        <button class="layui-btn layui-btn-warm" id="add"><i class="layui-icon layui-icon-add-circle-fine"></i>新增</button>
        <button class="layui-btn layui-btn-danger" id="del"><i class="layui-icon layui-icon-delete"></i>批量删除</button>
    </xblock>
    <table class="layui-hide" id="staffList" lay-filter="staffList"></table>
    <!--  <input type="text" name="total1" id="total1" class="layui-input"> -->
    <script type="text/html" id="rowToolbar">
        <a class="layui-btn layui-btn-xs" lay-event="update"><i class="layui-icon layui-icon-edit"></i>编辑</a>
    </script>
</div>
<script type="text/javascript">
    layui.use(['table','layer','upload','form','laydate'], function(){
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        var laydate = layui.laydate;

        var $ = layui.jquery, active = {
            reload:function () {
                var keyword01 = $("#keyword").val();
                table.reload('contenttable',{
                    method:'get',
                    where:{"carid":keyword01}
	                ,page: {
	                    curr: 1//重新从第 1 页开始
	                }
                });
            }
        }

        $('.layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
        table.render({
            elem: '#staffList'
            ,url:'${pageContext.request.contextPath }/transport/findTransport.do'
            ,title: '运输列表'
            ,id :'contenttable'
            ,limits:[10,20,30]
            ,toolbar: '#toolbar'
            ,totalRow: true
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'', title:'序号', sort: true, type:'numbers', width: 60, unresize: true, sort: true, totalRowText: '合计'}
                ,{field:'carname', title:'车辆'}
                ,{field:'warename', title:'仓库'}
                ,{field:'fuel', title:'加油费', sort: true, totalRow: true}
                ,{field:'bridge', title:'过桥费', sort: true, totalRow: true}
                ,{field:'depreciation', title:'折旧费', sort: true, totalRow: true}
                ,{field:'maintenance', title:'维修费', sort: true, totalRow: true}
                ,{field:'outhire', title:'外雇车', sort: true, totalRow: true}
                ,{field:'other', title:'其他', sort: true, totalRow: true}
                ,{field:'remark', title:'备注'}
                ,{fixed:'right',unresize: true, title:'操作', toolbar: '#rowToolbar',width:100, align: 'center'}
            ]]
            ,page: true
            ,done: function(res, curr, count){
            	$('th').css({
                    'background-color': '#009688', 'color': '#fff','font-weight':'bold',
                })
        	    //如果是异步请求数据方式，res即为你接口返回的信息。
        	    //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
        		var total1 = 0;
        		for( i=0;i<count;i++){    			
        			total1 = parseFloat(fuel)+total1;
        		}
        		
        	 
        	    $("#total1").val(total1);
        	    
        	    //得到当前页码
        	    console.log(curr); 
     
        	  }
        })

        //监听复选框事件
        table.on('checkbox(staffList)',function(obj){
            if(obj.checked == true && obj.type == 'all'){
                //点击全选
                $('.layui-table-body table.layui-table tbody tr').addClass('layui-table-click');
            }else if(obj.checked == false && obj.type == 'all'){
                //点击全不选
                $('.layui-table-body table.layui-table tbody tr').removeClass('layui-table-click');
            }else if(obj.checked == true && obj.type == 'one'){
                //点击单行
                if(obj.checked == true){
                    obj.tr.addClass('layui-table-click');
                }else{
                    obj.tr.removeClass('layui-table-click');
                }
            }else if(obj.checked == false && obj.type == 'one'){
                //点击全选之后点击单行
                if(obj.tr.hasClass('layui-table-click')){
                    obj.tr.removeClass('layui-table-click');
                }
            }
        })

        /**
         * 表单校验
         */
        form.verify({
            //value：表单的值、item：表单的DOM对象
            carid: function(value, item){
                if(value == ''){
                    return '车牌号码不能为空';
                }
            },
            warehouseid: function(value, item){
                if(value == ''){
                    return '仓库不能为空';
                }
            },
            fuel: function(value, item){
                if(value == ''){
                    return '加油费不能为空';
                }
            },
            bridge: function(value, item){
                if(value == ''){
                    return '过桥费号不能为空';
                }
            },
         
            depreciation: function(value, item){
                if(value == ''){
                    return '折旧费不能为空';
                }
            },
            maintenance: function(value, item){
                if(value == ''){
                    return '维修费不能为空';
                }
            }, 
            outhire: function(value, item){
                if(value == ''){
                    return '外雇车不能为空';
                }
            },
            other: function(value, item){
                if(value == ''){
                    return '其他不能为空';
                }
            }
        });

        //新增
        $("#add").click(function(){
            layer.open({
                type: 1 					//Page层类型
                ,area: ['670px', '430px'] 	//宽  高
                ,title: '新增'
                ,shade: 0.6 				//遮罩透明度
                ,maxmin: true 				//允许全屏最小化
                ,anim: 1 					//0-6的动画形式，-1不开启
                ,content:
                    '<div id="addDivID">'+
                        '<form class="layui-form" id="addFormID">'+
                            '<xblock>'+
                                '<table>'+
                                    '<tr style="height: 10px"></tr>'+
                                    '<tr>'+
                                        '<td><label class="layui-form-label">车牌号码</label></td>'+
                                        '<td>'+
                                        '<div class="layui-input-inline" style="width:190px; float: left;">'+
        								'<select id="carId" name="carid" lay-verify="carid" lay-filter="carid">'+
        									'<option value="">请选择车牌号</option>'+
        									'<c:forEach items="${allCar}" var="car">'+
        										'<option value="${car.id}">${car.plate}</option>'+
        									'</c:forEach>'+
        								'</select>'+
        							'</div>'+
                                        '</td>'+
                                        '<td><label class="layui-form-label">仓库</label></td>'+
                                        '<td>'+
                                        '<div class="layui-input-inline" style="width:190px; float: left;">'+
        								'<select id="carId" name="warehouseid" lay-verify="warehouseid" lay-filter="warehouseid">'+
        									'<option value="">请选择仓库</option>'+
        									'<c:forEach items="${warehouseList}" var="ware">'+
        										'<option value="${ware.id}">${ware.warehouse_name}</option>'+
        									'</c:forEach>'+
        								'</select>'+
        							'</div>'+
                                        '</td>'+
                                    '</tr>'+
                                    '<tr style="height: 10px"></tr>'+
                                    '<tr>'+
                                        '<td><label class="layui-form-label">加油费</label></td>'+
                                        '<td>'+
                                            '<input class="layui-input" id="fuel" name="fuel" lay-verify="fuel" type="number" style="width: 190px; display:inline">'+
                                            '<div class="layui-inline" style="margin-top: 10px;">'+
                                                '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                            '</div>'+
                                        '</td>'+
                                        '<td><label class="layui-form-label">过桥费</label></td>'+
                                        '<td>'+
                                            '<input class="layui-input" id="bridge" name="bridge" lay-verify="bridge" type="number" style="width: 190px; display:inline">'+
                                            '<div class="layui-inline" style="margin-top: 10px;">'+
                                                '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                            '</div>'+
                                        '</td>'+
                                    '</tr>'+
                                    '<tr style="height: 10px"></tr>'+
                                    '<tr>'+
                                    '<td><label class="layui-form-label">折旧费</label></td>'+
                                    '<td>'+
                                        '<input class="layui-input" id="depreciation" name="depreciation" lay-verify="depreciation" type="number" style="width: 190px; display:inline">'+
                                        '<div class="layui-inline" style="margin-top: 10px;">'+
                                            '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                        '</div>'+
                                    '</td>'+
                                    '<td><label class="layui-form-label">维修费</label></td>'+
                                    '<td>'+
                                        '<input class="layui-input" id="maintenance" name="maintenance" lay-verify="maintenance" type="number" style="width: 190px; display:inline">'+
                                        '<div class="layui-inline" style="margin-top: 10px;">'+
                                            '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                        '</div>'+
                                    '</td>'+
                                        
                                    '</tr>'+
                                    '<tr style="height: 10px"></tr>'+
                                    '<tr>'+
                                    '<td><label class="layui-form-label">外雇车</label></td>'+
                                    '<td>'+
                                        '<input class="layui-input" id="outhire" name="outhire" lay-verify="outhire" type="number" style="width: 190px; display:inline">'+
                                        '<div class="layui-inline" style="margin-top: 10px;">'+
                                            '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                        '</div>'+
                                    '</td>'+
                                    '<td><label class="layui-form-label">其他</label></td>'+
                                    '<td>'+
                                        '<input class="layui-input" id="other" name="other" lay-verify="other" type="number" style="width: 190px; display:inline">'+
                                        '<div class="layui-inline" style="margin-top: 10px;">'+
                                            '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                        '</div>'+
                                    '</td>'+
                                        
                                    '</tr>'+
                                    '<tr style="height: 10px"></tr>'+
                                    '<tr>'+
                                        '<td><label class="layui-form-label">备注</label></td>'+
                                        '<td colspan="3">'+
                                            '<textarea class="layui-textarea" style="width:504px;height:25px" id="remark" name="remark" ></textarea>'+
                                        '</td>'+
                                    '</tr>'+
                                    '<tr style="height: 20px"></tr>'+
                                    '<tr align="center">'+
                                        '<td colspan="2"><button class="layui-btn layui-btn-blue" id="subBtn" lay-submit lay-filter="addForm" style="margin-left:160px; margin-bottom: 10px">提交</button></td>'+
                                        '<td colspan="2">&emsp;&emsp;&emsp;&emsp;<button class="layui-btn layui-btn-primary" style="margin-bottom: 10px">取消</button></td>'+
                                    '</tr>'+
                                '</table>'+
                            '</xblock>'+
                        '</form>'+
                    '</div>'
                ,success: function(){
                    laydate.render({
                        elem: '#create_time'
                    });
                    form.render();
                }
            });
        });

        //编辑
        table.on('tool(staffList)', function(obj){
            var data = obj.data;
            layer.open({
                type: 1 					//Page层类型
                ,area: ['670px', '330px'] 	//宽  高
                ,title: '编辑'
                ,shade: 0.6 				//遮罩透明度
                ,maxmin: true 				//允许全屏最小化
                ,anim: 1 					//0-6的动画形式，-1不开启
                ,content:
                    '<div id="updateDivID">'+
                        '<form class="layui-form" id="updateFormID">'+
                            '<xblock>'+
                            '<table>'+
                            '<tr style="height: 10px"></tr>'+
                            '<tr>'+
                                '<td><label class="layui-form-label">车牌号码</label></td>'+
                                '<td>'+
                                '<div class="layui-input-inline" style="width:190px; float: left;">'+
								'<select id="carId" name="carid" lay-verify="carid" lay-filter="carid">'+
									'<option value="">'+data.carname+'</option>'+
									'<c:forEach items="${allCar}" var="car">'+
										'<option value="${car.id}">${car.plate}</option>'+
									'</c:forEach>'+
								'</select>'+
							'</div>'+
                                '</td>'+
                                '<td><label class="layui-form-label">仓库</label></td>'+
                                '<td>'+
                                '<div class="layui-input-inline" style="width:190px; float: left;">'+
								'<select id="carId" name="warehouseid" lay-verify="warehouseid" lay-filter="warehouseid">'+
									'<option value="">'+data.warename+'</option>'+
									'<c:forEach items="${warehouseList}" var="ware">'+
										'<option value="${ware.id}">${ware.warehouse_name}</option>'+
									'</c:forEach>'+
								'</select>'+
							'</div>'+
                                '</td>'+
                            '</tr>'+
                            '<tr style="height: 10px"></tr>'+
                            '<tr>'+
                                '<td><label class="layui-form-label">加油费</label></td>'+
                                '<td>'+
                                '<input  id="id" value="'+data.id+'" name="id"type="hidden" >'+
                                    '<input class="layui-input" id="fuel" value="'+data.fuel+'" name="fuel" lay-verify="fuel" type="number" style="width: 190px; display:inline">'+
                                    '<div class="layui-inline" style="margin-top: 10px;">'+
                                        '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                    '</div>'+
                                '</td>'+
                                '<td><label class="layui-form-label">过桥费</label></td>'+
                                '<td>'+
                                    '<input class="layui-input" id="bridge" value="'+data.bridge+'" name="bridge" lay-verify="bridge" type="number" style="width: 190px; display:inline">'+
                                    '<div class="layui-inline" style="margin-top: 10px;">'+
                                        '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                    '</div>'+
                                '</td>'+
                            '</tr>'+
                            '<tr style="height: 10px"></tr>'+
                            '<tr>'+
                            '<td><label class="layui-form-label">折旧费</label></td>'+
                            '<td>'+
                                '<input class="layui-input" id="depreciation" value="'+data.depreciation+'" name="depreciation" lay-verify="depreciation" type="number" style="width: 190px; display:inline">'+
                                '<div class="layui-inline" style="margin-top: 10px;">'+
                                    '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                '</div>'+
                            '</td>'+
                            '<td><label class="layui-form-label">维修费</label></td>'+
                            '<td>'+
                                '<input class="layui-input" id="maintenance" value="'+data.maintenance+'" name="maintenance" lay-verify="maintenance" type="number" style="width: 190px; display:inline">'+
                                '<div class="layui-inline" style="margin-top: 10px;">'+
                                    '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                '</div>'+
                            '</td>'+
                                
                            '</tr>'+
                            '<tr style="height: 10px"></tr>'+
                            '<tr>'+
                            '<td><label class="layui-form-label">外雇车</label></td>'+
                            '<td>'+
                                '<input class="layui-input" id="outhire" name="outhire" value="'+data.outhire+'" lay-verify="outhire" type="number" style="width: 190px; display:inline">'+
                                '<div class="layui-inline" style="margin-top: 10px;">'+
                                    '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                '</div>'+
                            '</td>'+
                            '<td><label class="layui-form-label">其他</label></td>'+
                            '<td>'+
                                '<input class="layui-input" id="other" name="other" value="'+data.other+'" lay-verify="other" type="number" style="width: 190px; display:inline">'+
                                '<div class="layui-inline" style="margin-top: 10px;">'+
                                    '<span style="color:red; font-size: 24px; margin-left: 4px">*</span>'+
                                '</div>'+
                            '</td>'+
                                
                            '</tr>'+
                            '<tr style="height: 10px"></tr>'+
                            '<tr>'+
                                '<td><label class="layui-form-label">备注</label></td>'+
                                '<td colspan="3">'+
                                    '<input class="layui-input" id="remark"  value="'+data.remark+'" name="remark" style="width: 504px">'+
                                '</td>'+
                            '</tr>'+
                            '<tr style="height: 20px"></tr>'+
                            '<tr align="center">'+
                                '<td colspan="2"><button class="layui-btn layui-btn-blue" id="subBtn" lay-submit lay-filter="updateForm" style="margin-left:160px; margin-bottom: 10px">提交</button></td>'+
                                '<td colspan="2">&emsp;&emsp;&emsp;&emsp;<button class="layui-btn layui-btn-primary" style="margin-bottom: 10px">取消</button></td>'+
                            '</tr>'+
                        '</table>'+ 
                            '</xblock>'+
                        '</form>'+
                    '</div>'
                ,success: function(){
                    laydate.render({
                        elem: '#create_time'
                    });
                    $("#user_id2").val(data.user_id);
                    form.render();
                }
            });
        });

        //批量删除
        $("#del").click(function(){
            var rowData = table.checkStatus('contenttable');
            var data = rowData.data;
            var idArr = new Array();
            if(data.length == 0){
                toastrStyle();
                toastr.warning("请至少选择一条记录！");
            } else {
                for(var i=0;i < data.length;i++){
                    idArr[i] = data[i].id;
                }
                $.ajax({
                    type:'post',
                    url:'${pageContext.request.contextPath }/transport/deleteTransport.do',
                    data:{"idArr" : idArr},
                    success:function(data){
                        layer.confirm('确定删除吗？', function(){
                            if(data > 0){
                                toastr.success("删除成功！");
                                setTimeout(function(){
                                    location.reload();
                                },1000);
                                setTimeout(function(){
                                    window.location.reload();
                                },2000);
                            }else{
                                toastr.warning("删除失败！");
                                location.reload();
                            }
                        });
                    }
                });
            }
        });

        /**
         * 通用表单提交(AJAX方式)
         */
        form.on('submit(addForm)', function () {
            $.ajax({
                type:'post',
                url:'${pageContext.request.contextPath }/transport/addTransport.do',
                data:$("#addFormID").serialize(),
                cache:false,
            }).done(
                function(res) {
                    if (res > 0) {
                        toastr.success('新增成功！');
                        setTimeout(function(){
                            location.reload();
                        },1000);
                    }
                }
            ).fail(
                function() {
                    toastr.error('新增失败！');
                    setTimeout(function(){
                        location.reload();
                    },1000);
                }
            )
            return false;
        })

        /**
         * 通用表单编辑(AJAX方式)
         */
        form.on('submit(updateForm)', function () {
            $.ajax({
                type : 'post',
                url : '${pageContext.request.contextPath }/transport/updateTransport.do',
                data : $("#updateFormID").serialize(),
                cache : false,
            }).done(
                function(res) {
                    if (res > 0) {
                        toastr.success('修改成功！');
                        setTimeout(function(){
                            location.reload();
                        },1000);
                    }
                }
            ).fail(
                function() {
                    toastr.error('修改失败！');
                    setTimeout(function(){
                        location.reload();
                    },1000);
                }
            )
            return false;
        })
    });
    toastr.options.positionClass = 'toast-top-center'; //提示框的位置设置为中上
    //日期格式转换
    function dateToStr(date) {
        var time = new Date(date.time);
        var y = time.getFullYear();
        var M = time.getMonth() + 1;
        M = M < 10 ? ("0" + M) : M;
        var d = time.getDate();
        d = d < 10 ? ("0" + d) : d;
        var str = y + "-" + M + "-" + d;
        return str;
    }
</script>
</body>
</html>
